<template>
  <div>
    <div class="contentDiv">
      <el-form :model="orgInfoForm" :rules="rules" ref="orgInfoForm" label-width="140px" class="demo-ruleForm">
        <el-row>
          <el-col span="12">
            <el-form-item label="统一信用代码：" prop="unifiedCreditDcode">
              <el-input v-model="orgInfoForm.unifiedCreditDcode" placeholder="请输入营业执照统一信用代码"></el-input>
            </el-form-item>
          </el-col>
          <el-col span="12">
             <el-form-item label="机构名称：" prop="orgName">
              <el-input v-model="orgInfoForm.orgName" placeholder="请输入营业执照企业名称"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="12">
            <el-form-item label="法人姓名：" prop="legalPersonName">
              <el-input v-model="orgInfoForm.legalPersonName" placeholder="请输入营业执照法人代表姓名"></el-input>
            </el-form-item>
          </el-col>
          <el-col span="12">
             <el-form-item label="法人身份证号：" prop="legalPersonIdCardNo">
              <el-input v-model="orgInfoForm.legalPersonIdCardNo"  maxlength="18"  placeholder="请输入营业执照法人身份证号码"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col span="12">
            <el-form-item label="联系人姓名：" prop="contactPersonName">
              <el-input v-model="orgInfoForm.contactPersonName" placeholder="请输入营业执照联系人姓名"></el-input>
            </el-form-item>
          </el-col>
          <el-col span="12">
             <el-form-item label="联系人身份证号：" prop="contactPersonIdCardNo">
              <el-input v-model="orgInfoForm.contactPersonIdCardNo" maxlength="18" placeholder="请输入营业执照联系人身份证号"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="12">
            <el-form-item label="联系电话：" prop="contactPhoneNo">
              <el-input v-model="orgInfoForm.contactPhoneNo" placeholder="请输入企业联系电话"></el-input>
            </el-form-item>
          </el-col>
          <el-col span="12">
            
            <el-form-item label="所属区域：" prop="belongAreaDcode">
                <el-cascader
                  size="large"
                  :options="options"
                  v-model="orgInfoForm.belongAreaDcode"
                  style="width: 100%"
                  @change="handleChange"
                  placeholder="请选择企业所属区域"
                >
               </el-cascader>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="24">
            <el-form-item label="注册地址：" prop="registAddress">
              <el-input v-model="orgInfoForm.registAddress" placeholder="营业执照企业注册地址（经营场所）"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="24">
            <el-form-item label="营业执照原件：" prop="businessLicenseUrl">
              <el-upload
                list-type="picture"
                class="upload-demo"
                action="/file/upload"
                :headers="headersParam"
                :data="dataParam"
                :on-preview="handleBusinessLicensePreview"
                :on-remove="handleBusinessLicenseRemove"
                :on-success="handleBusinessLicenseSuccess"
                :file-list="orgInfoForm.businessLicenseUrl"
                :multiple="false"
                :limit="1"
                >
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip"><span style="color:red;font-size:16px;">*</span>只能上传jpg/png文件，且不超过500kb</div>
              </el-upload>
              <el-dialog :visible.sync="businessLicenseUrlVisible">
                <img width="100%" :src="businessLicensePreviewUrl" alt="">
              </el-dialog>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col span="24">
            <el-form-item label="法人身份证：" prop="legalPersonIdCardUrl">
              <el-upload
                list-type="picture"
                class="upload-demo"
                action="/file/upload"
                :headers="headersParam"
                :data="dataParam"
                :on-preview="handleLegalPersonPreview"
                :on-remove="handleLegalPersonRemove"
                :on-success="handleLegalPersonSuccess"
                :file-list="orgInfoForm.legalPersonIdCardUrl"
                multiple
                :limit="2"
                >
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip"><span style="color:red;font-size:16px;">*</span> 上传法人身份证原件照片，正反面都要上传，只能上传jpg/png文件，且不超过1MB</div>
              </el-upload>
               <el-dialog :visible.sync="legalPersonUrlVisible">
                <img width="100%" :src="legalPersonPreviewUrl" alt="">
              </el-dialog>
            </el-form-item>
          </el-col>
        </el-row>

         <el-row>
          <el-col span="24">
            <el-form-item label="联系人身份证：" prop="contactPersonIdCardUrl">
              <el-upload
                list-type="picture"
                class="upload-demo"
                action="/file/upload"
                :headers="headersParam"
                :data="dataParam"
                :on-preview="handleContactPersonPreview"
                :on-remove="handleContactPersonRemove"
                :on-success="handleContactPersonSuccess"
                :file-list="orgInfoForm.contactPersonIdCardUrl"
                multiple
                :limit="2"
                >
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip"><span style="color:red;font-size:16px;">*</span> 上传联系人身份证原件照片，正反面都要上传，只能上传jpg/png文件，且不超过1MB</div>
              </el-upload>
               <el-dialog :visible.sync="contactPersonUrlVisible">
                <img width="100%" :src="contactPersonPreviewUrl" alt="">
              </el-dialog>
            </el-form-item>
          </el-col>
          
        </el-row>
        <el-form-item  style="text-align:right">
          <span @click="showOrgList" style="padding-right:30px;font-weight:bold;font-size:14px;color:#509ad4; text-decoration: underline; cursor:pointer;">若已提交，可点击查看审核结果</span>
          <el-button type="primary" @click="submitForm">提交</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 
      查看审核对话框
     -->
    <el-dialog title="审核结果" :modal='true' top="15vh" center width='70%' :close-on-click-modal='false' :visible.sync="orgListDialog">
      <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               v-model="form"
               :before-open="beforeOpen"
               @row-update="rowUpdate"
               @search-change="searchChange"
               @search-reset="searchReset"
               >
        <template slot-scope="scope" slot="menu">
          <el-button v-if="scope.row.status == '0' || scope.row.status == '3'" type="text"
                    size="small"
                    icon="el-icon-document-copy"
                    @click="editRow(scope.row)">重新编辑
          </el-button>
          <el-button v-if="scope.row.status == '1'" type="text"
                    size="small"
                    icon="el-icon-view"
                    @click="handleCallback(scope.row)">撤回
          </el-button>
        </template>
      </avue-crud>
    </el-dialog>
    <div style="text-align: center; padding-bottom: 50px; font-size: 14px">
      XXXX <span style="color: #666666"> 提供技术支持</span>
    </div>
  </div>
</template>

<script>
import {exportSysCustomOrgInfoExcel,saveOrUpdateSysCustomOrgInfo,saveOrUpdateSysCustomOrgInfoList,saveSysCustomOrgInfo,saveSysCustomOrgInfoList,deleteSysCustomOrgInfo,querySysCustomOrgInfo,querySysCustomOrgInfoListPage,updateSysCustomOrgInfo,deleteSysCustomOrgInfoList} from '@/api/system/sysCustomOrgInfoApi';
import { mapGetters } from 'vuex';
import { reqCommonMsg } from '@/util/reqCommonMsg';
import { regionData, CodeToText } from 'element-china-area-data';
import { getToken } from '@/util/auth';
import { Base64 } from 'js-base64';
export default {
  data() {
    return {
      // 弹出对话框
      orgListDialog: false,
      form: {},
      currentRow: {},
      loading: true, 
      showColumn: [],
      option: {
        labelPosition: 'right',
        labelSuffix: '：',
        labelWidth: 125,
        dialogTop: '50',
        indexFixed:true, 
        stripe:true,
        calcHeight: 80,
        searchShow: true,
        searchMenuSpan: 6,
        tip: false,
        border: true,
        index: true,
        selection: true,
        addBtn: false,
        editBtn: false,
        viewBtn: false,
        delBtn: false,
        cancelBtn: true,
        printBtn:false,
        selection: false,
        saveBtn: true,
        filterBtn:false,  
        refreshBtn:false,     
        columnBtn:false,         
        menuWidth: 200,
        dialogMenuPosition: 'center',
        dialogDirection:'rtl',
        dialogType:'dialog',
        dialogFullscreen:false,
        dialogClickModal:false,
        dialogWidth: '70%',
        highlightCurrentRow:  true,
        searchShow:true,
        sortable: true,
        column: [
          {
            label: '信用代码',
            prop: 'unifiedCreditDcode', 
            type: 'input', 
            search: true,
            searchMmultiple: false,
            searchLabelWidth: 100,
            searchSpan:18,
            multiple: false,
            span: 12,
            sortable: false,
            hide: false,
            maxlength: 30,
            overHidden: true,
            disabled: true,
            rules: [{
              message: '请输入统一信用代码',
              required:  true,
              trigger: 'blur'
            },
            {
              max: 30,
              message: '内容长度不能超过30字符',
              trigger: 'blur'
            }],
            dicData:[],
          },
          {
            label: '机构名称',
            prop: 'orgName', 
            type: 'input', 
            search: false,
            searchMmultiple: false,
            searchLabelWidth: 100,
            multiple: false,
            span: 12,
            sortable: false,
            hide: false,
            maxlength: 50,
            overHidden: true,
            disabled: true,
            rules: [{
              message: '请输入机构名称',
              required:  true,
              trigger: 'blur'
            },
            {
              max: 50,
              message: '内容长度不能超过50字符',
              trigger: 'blur'
            }],
            dicData:[],
          },
          
          {
            label: '提交时间',
            prop: 'createDatetime', 
            type: 'input', 
            search: false,
            searchMmultiple: false,
            searchLabelWidth: 100,
            multiple: false,
            span: 12,
            sortable: false,
            hide: false,
            maxlength: 30,
            overHidden: true,
            disabled: true,
            dicData:[],
          },
          {
            label: '审核状态',
            prop: 'status', 
            type: 'select', 
            search: false,
            searchMmultiple: false,
            searchLabelWidth: 100,
            multiple: false,
            span: 12,
            sortable: false,
            hide: false,
            maxlength: 30,
            overHidden: true,
            rules: [{
              message: '请输入传真号码',
              required:  false,
              trigger: 'blur'
            },
            {
              max: 30,
              message: '内容长度不能超过30字符',
              trigger: 'blur'
            }],
            dicData:[
              {label:'已撤回',value: '0'},
              {label:'待审核',value: '1'},
              {label:'审核通过',value: '2'},
              {label:'审核驳回',value: '3'}
            ],
            
          }
        ]
      },
      data: [],


      // 地址选择栏
      options: regionData,
      addtions: {}, //存储地址数据】

      //上传文件
      headersParam: {},
      dataParam: {},
      // 营业执照附件
      businessLicenseUrlVisible: false,
      businessLicensePreviewUrl: '',

      // 法人身份证附件
      legalPersonUrlVisible: false,
      legalPersonPreviewUrl: '',

      // 联系人身份证附件
      contactPersonUrlVisible: false,
      contactPersonPreviewUrl: '',

      // 机构表单
      orgInfoForm: {
        id:'',
        unifiedCreditDcode: '',
        orgName: '',
        businessLicenseUrl: [],
        legalPersonName: '',
        legalPersonIdCardNo: '',
        legalPersonIdCardUrl: [],
        registAddress: '',
        contactPersonName: '',
        contactPersonIdCardNo: '',
        contactPersonIdCardUrl: [],
        contactPhoneNo: '',
        belongAreaDcode: '',
        belongAreaName: '',
      },
      
      rules: {
        unifiedCreditDcode: [
          { required: true, message: '请输入营业执照统一信用代码', trigger: 'blur' }
        ],
        orgName: [
          { required: true, message: '请输入营业执照企业名称', trigger: 'blur' }
        ],
        businessLicenseUrl: [
          { 
            // 检查营业执照
            validator: (rule, value, callback) => {
              if(value.length != 1){
                callback(new Error('请上传企业营业执照原件照片！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        legalPersonName: [
          { required: true, message: '请输入营业执照法人代表姓名', trigger: 'blur' }
        ],
        legalPersonIdCardNo: [
          {
			      // 检查身份证号码
            validator: (rule, value, callback) => {
              var validate = this.$validate.cardid(value)
              if(!validate.result){
                callback(new Error(validate.msg));
              }
              else{
                callback();
              }
            },
            required:  true,
            trigger: 'blur'
          }
          //{ required: true, message: '请输入营业执照法人身份证号码', trigger: 'blur' }
        ],
        legalPersonIdCardUrl: [
          { 
            // 检查营业执照
            validator: (rule, value, callback) => {
              this.$console.log('value.length===',value.length);
              if(value.length != 2){
                callback(new Error('请上传企业法人原件正反面照片！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        registAddress: [
          { required: true, message: '请输入营业执照企业注册地址（经营场所）', trigger: 'blur' }
        ],
        contactPersonName: [
          { required: true, message: '请输入营业执照联系人姓名', trigger: 'blur' }
        ],
        contactPersonIdCardNo: [
          {
			      // 检查身份证号码
            validator: (rule, value, callback) => {
              var validate = this.$validate.cardid(value)
              if(!validate.result){
                callback(new Error(validate.msg));
              }
              else{
                callback();
              }
            },
            required:  true,
            trigger: 'blur'
          }
          //{ required: true, message: '请输入营业执照联系人身份证号码', trigger: 'blur' }
        ],
        contactPhoneNo: [
          { 
            // 检查手机号
            validator: (rule, value, callback) => {
              if(!this.$validate.isPhoneNo(value)){
                callback(new Error('请输入有效的电话号码！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        contactPersonIdCardUrl: [
          { 
            // 检查营业执照
            validator: (rule, value, callback) => {
              if(value.length != 2){
                callback(new Error('请上传企业联系人原件正反面照片！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        belongAreaDcode: [
          { required: true, message: '请选择企业所在区域', trigger: 'blur' }
        ]
      },
      // 请求参数区
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      reqParams: {
        singleBody: {},
        listBody: [{}],
        sqlCondition: [],
        orderRule: [],
        currentPage: 1,
        pageSize: 10,
      },
      commonData: null,
      conditions: [],
      orderRules: [],
      singleBody: {},
    };
  },
  computed: {
    ...mapGetters([
      'website',
      'orgTree',
      'genOrgTree',
      'userInfo',
      'permission',
      'projectInfo',
      'isWarterMark'
    ]),
  },
  methods: {
    
    /**
     * 查看提交记录
     */
    showOrgList(){
      this.orgListDialog = true;
      //加载记录
      this.loading = true;
      this.reqParams =  {
        singleBody: this.singleBody,
        listBody: [{}],
        sqlCondition: this.conditions,
        orderRule: this.orderRules,
        currentPage: 1, 
        pageSize: 9999
      }
      this.commonData = reqCommonMsg(this.reqParams)
      querySysCustomOrgInfoListPage(this.commonData).then(res => {
        const data = res.data.body;
        this.data = data.listBody;
        this.loading = false;
      }, error => {
        this.loading = false; 
      });
    },
    /**
     * 搜索
     */
    searchChange(params, done) {
      this.singleBody = params
      this.page.currentPage = 1;
      this.showOrgList();
      done();
    },
    /**
     * 重新编辑记录
     */
    editRow(row){
      this.$confirm('温馨提示：此操作将覆盖当前正在编辑的数据！确定继续吗？', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.orgListDialog = false;
          this.orgInfoForm = row;
          this.orgInfoForm.businessLicenseUrl = JSON.parse(this.orgInfoForm.businessLicenseUrl);
          this.orgInfoForm.legalPersonIdCardUrl = JSON.parse(this.orgInfoForm.legalPersonIdCardUrl);
          this.orgInfoForm.contactPersonIdCardUrl = JSON.parse(this.orgInfoForm.contactPersonIdCardUrl);
        })
    },
    /**
     * 撤回记录
     */
    handleCallback(row) {
      this.$confirm('确定将当前记录撤回?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          row.status='0';
          this.reqParams.singleBody = row;
          this.commonData = reqCommonMsg(this.reqParams);
          updateSysCustomOrgInfo(this.commonData).then(() => {
            this.$message({
              type: 'success',
              message: '撤回成功!'
            });
          }, error => {
            this.$console.log(error);
          });
        })
    },
    ///*+++++++++++++处理营业执照附件+++++++++++++++++++ */
    /**
     * 上传营业执照成功回调
     */
    handleBusinessLicenseSuccess(response, file, fileList) {
      if(!response.head){
        this.orgInfoForm.businessLicenseUrl = [];
        this.$message({
          type: 'error',
          message: '文件上传错误，请联系管理员！',
        },5000);
      }
      else if (response.head.respCode == 'S0000') {
        var dataList = [];
        fileList.forEach((element) => {
          if (element.response) {
            if (element.status == 'success') {
              dataList.push({
                name: element.response.fileName,
                url: element.response.filePath,
                size: element.response.fileSize,
                type: element.response.fileType,
              });
            }
          } else if (element.name) {
            dataList.push(element);
          }
        });
        this.orgInfoForm.businessLicenseUrl  = dataList;
        this.$console.log('this.orgInfoForm.businessLicenseUrl===', this.orgInfoForm.businessLicenseUrl);
      } else {
        file.status = 'error';
        this.$message({
          customClass: 'zZindex',
          type: 'error',
          message: response.respMsg,
        });
      }
    },
    /**
     * 移除营业执照
     */
    handleBusinessLicenseRemove(file, fileList){
      var dataList = [];
      fileList.forEach((element) => {
        if (element.response) {
          if (element.status == 'success') {
            dataList.push({
              name: element.response.fileName,
              url: element.response.filePath,
              size: element.response.fileSize,
              type: element.response.fileType,
            });
          }
        } else if (element.name) {
          dataList.push(element);
        }
      });
      this.orgInfoForm.businessLicenseUrl  = dataList;
    },
    /**
     * 预览营业执照
     */
    handleBusinessLicensePreview(file) {
      this.businessLicensePreviewUrl = file.url;
      this.businessLicenseUrlVisible = true;
    },
    ///*+++++++++++++处理营业执照附件结束+++++++++++++++++++ */

    ///*+++++++++++++法人身份证附件+++++++++++++++++++ */
    /**
     * 上传法人身份证成功回调
     */
    handleLegalPersonSuccess(response, file, fileList) {
      if(!response.head){
        this.orgInfoForm.legalPersonIdCardUrl = [];
        this.$message({
          type: 'error',
          message: '文件上传错误，请联系管理员！',
        },5000);
      }
      else if (response.head.respCode == 'S0000') {
        var dataList = [];
        fileList.forEach((element) => {
          if (element.response) {
            if (element.status == 'success') {
              dataList.push({
                name: element.response.fileName,
                url: element.response.filePath,
                size: element.response.fileSize,
                type: element.response.fileType,
              });
            }
          } else if (element.name) {
            dataList.push(element);
          }
        });
        this.orgInfoForm.legalPersonIdCardUrl  = dataList;
      } else {
        file.status = 'error';
        this.$message({
          customClass: 'zZindex',
          type: 'error',
          message: response.respMsg,
        });
      }
    },
    /**
     * 移除法人身份证
     */
    handleLegalPersonRemove(file, fileList){
      var dataList = [];
      fileList.forEach((element) => {
        if (element.response) {
          if (element.status == 'success') {
            dataList.push({
              name: element.response.fileName,
              url: element.response.filePath,
              size: element.response.fileSize,
              type: element.response.fileType,
            });
          }
        } else if (element.name) {
          dataList.push(element);
        }
      });
      this.orgInfoForm.legalPersonIdCardUrl  = dataList;
    },
    /**
     * 预览营业执照
     */
    handleLegalPersonPreview(file) {
      this.legalPersonPreviewUrl = file.url;
      this.legalPersonUrlVisible = true;
    },
    ///*+++++++++++++法人身份证附件结束+++++++++++++++++++ */


    ///*+++++++++++++联系人身份证附件+++++++++++++++++++ */
    /**
     * 上传营业执照成功回调
     */
    handleContactPersonSuccess(response, file, fileList) {
      this.$console.log('handleSuccess==='+JSON.stringify(fileList));
      if(!response.head){
        this.orgInfoForm.contactPersonIdCardUrl = [];
        this.$message({
          type: 'error',
          message: '文件上传错误，请联系管理员！',
        },5000);
      }
      else if (response.head.respCode == 'S0000') {
        var dataList = [];
        fileList.forEach((element) => {
          if (element.response) {
            if (element.status == 'success') {
              dataList.push({
                name: element.response.fileName,
                url: element.response.filePath,
                size: element.response.fileSize,
                type: element.response.fileType,
              });
            }
          } else if (element.name) {
            dataList.push(element);
          }
        });
        this.orgInfoForm.contactPersonIdCardUrl  = dataList;
        this.$console.log('this.orgInfoForm.businessLicenseUrl===', this.orgInfoForm.businessLicenseUrl);
      } else {
        file.status = 'error';
        this.$message({
          customClass: 'zZindex',
          type: 'error',
          message: response.respMsg,
        });
      }
    },
    /**
     * 移除营业执照
     */
    handleContactPersonRemove(file, fileList){
      var dataList = [];
      fileList.forEach((element) => {
        if (element.response) {
          if (element.status == 'success') {
            dataList.push({
              name: element.response.fileName,
              url: element.response.filePath,
              size: element.response.fileSize,
              type: element.response.fileType,
            });
          }
        } else if (element.name) {
          dataList.push(element);
        }
      });
      this.orgInfoForm.contactPersonIdCardUrl  = dataList;
    },
    /**
     * 预览营业执照
     */
    handleContactPersonPreview(file) {
      this.contactPersonPreviewUrl = file.url;
      this.contactPersonUrlVisible = true;
    },
    ///*+++++++++++++联系人身份证附件结束+++++++++++++++++++ */
    /**
     * 处理地区多级选择框
     */
    handleChange() {
      //我们要取出区域码对应的汉字，就需要用CodeToText(区域码)进行输出
      var name = '';
      this.orgInfoForm.belongAreaDcode.map(
        (item) => (name += CodeToText[item] + '/')
      );
      this.orgInfoForm.belongAreaName = name;
    },
    /**
     * 提交
     */
    submitForm() {
      this.$refs.orgInfoForm.validate((valid) => {
        if (valid) {
          this.$console.log('数据验证通过！');   
          // 如果ID存在表示修改记录，否则新增记录
          if(this.orgInfoForm.id){
            this.orgInfoForm.status='1';
            this.reqParams.singleBody = this.orgInfoForm;
            this.commonData = reqCommonMsg(this.reqParams);
            updateSysCustomOrgInfo(this.commonData).then(() => {
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              //跳转到成功提示页面
              this.$router.push({path: '/website/addOrgSuccess'});
            }, error => {
              this.$console.log(error);
            });
          }
          else{
            this.orgInfoForm.status='1';
            this.reqParams.singleBody = this.orgInfoForm;
            this.commonData = reqCommonMsg(this.reqParams)
            saveSysCustomOrgInfo(this.commonData).then(() => {
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              //跳转到成功提示页面
              this.$router.push({path: '/website/addOrgSuccess'});
            }, error => {
              this.$console.log(error);
            });  
          }            
        }
        else{
          this.$console.log('数据验证失败！');     
        }
      });
    },
  },
  created() {
    // let urlParam = this.$toolUtil.UrlSearch();
    // if (urlParam.qn) {
    //   this.questionSheetId = Base64.decode(urlParam.qn.replace(/%3D/g, '='));
    // } else {
    //   alert('访问无效');
    // }
  },
  mounted() {
    //初始化文件上传头信息
    this.headersParam = {
      Authorization: 'bearer ' + getToken(),
      UserId: this.userInfo.userId,
      UserSign: 'uploadFile',
      remote: 'no',
    };
  },
};
</script>
<style  lang="scss">
html,
body,
#app {
  height: 100%;
  overflow: auto;
  margin: 0;
  padding: 0;
  background: #edf2f7 !important;
}
.contentDiv {
  margin: 0 auto;
  width: 900px;
  margin-bottom: 50px;
  margin-top: 100px;
  padding: 30px;
  background-color: #ffffff;
  border-radius: 5px;
  .el-input__inner{
    border-radius: 5px !important;
  }
  .el-upload--picture-card{
    height: 80px !important;
    width: 80px  !important;
    line-height:90px !important;
  }
  .el-icon-plus{
    font-size: 14px;
  }
  .el-form-item{
    margin: 10px !important;
  }
  .el-form-item__error{
    padding-top: 0px !important;
  }
  .el-form-item__label{
    padding-right: 0px !important;
  }
  .el-form-item__content{
    .el-dialog__header {
      padding: 50px 20px 10px !important;
    }
  }
  .el-upload-list__item-thumbnail{
    width: 150px !important;
    height: 70px !important;
  }
}

</style>
